<!DOCTYPE html>
<html lang="en">
<head>
<style>
    /* h3,p{
        color: red;
    } */

/* div~p{
    background-color: blue;
} */
div+p{
    background-color: blue;
}
/* div>p{
    background-color: blue;
} */
</style>
    <title>Grouping and nesting of styles</title>
</head>
<body>

    <BODY>
        <H1>Welcome to the page.</H1>
        <DIV>
        <h2>We are learning HTML</h2>
        <P>This is paragraph 1.</P>
        <P>This is paragraph n.</P>
        </DIV>
        <!-- <h2>We are learning HTML</h2> div+p -->
        <P>This is paragraph 2.</P>
        <div><P>This is paragraph 3.</P></div>
        <P>This is paragraph 3.</P>
        </BODY>
        </HTML> 
